<template>
  <!-- 物料主数据表单弹窗 -->
  <el-dialog
    :close-on-click-modal="false"
    v-model="visibleDialog"
    :title="props.title"
    width="1300px"
    draggable
    @close="closeDialog"
  >
    <el-form ref="formRef" :model="formData" :rules="rules" label-width="120px">
      <!-- 第一行 -->
      <!-- <div style="margin: 0 10px 20px 0; font-weight: bold; font-size: 16px">
        基本信息
      </div> -->
      <el-divider content-position="left" v-if="!props.isReadonly"
        ><span style="font-weight: bold; font-size: 16px"
          >基本信息</span
        ></el-divider
      >
      <el-row>
        <el-col :span="6">
          <el-form-item label="存货编码" prop="materialCode">
            <el-input
              v-if="!props.isReadonly"
              v-model="formData.materialCode"
              placeholder="请输入存货编码"
              clearable
            />

            <span class="word" v-else>{{ formData.materialCode }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="物料名称" prop="materialName">
            <el-input
              v-if="!props.isReadonly"
              v-model="formData.materialName"
              placeholder="请输入物料名称"
              clearable
            />

            <span class="word" v-else>{{ formData.materialName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="短号" prop="shortCode">
            <el-input
              v-if="!props.isReadonly"
              v-model="formData.shortCode"
              placeholder="请输入短号"
              clearable
            />
            <span class="word" v-else>{{ formData.shortCode }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="外来编号" prop="srcCode">
            <el-input
              v-if="!props.isReadonly"
              v-model="formData.srcCode"
              placeholder="请输入外来编号"
              clearable
            />

            <span class="word" v-else>{{ formData.srcCode }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- 第二行 -->
      <el-row>
        <el-col :span="6">
          <el-form-item label="工厂" prop="plantCode">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.plantCode"
              placeholder="请选择工厂"
              clearable
              @change="changePlant"
              filterable
            >
              <el-option
                v-for="item in plantList"
                :key="item.id"
                :label="item.organizationCode"
                :value="item.organizationCode"
              />
            </el-select>

            <span v-else>{{ formData.plantCode }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="物料组" prop="materialGroupId">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.materialGroupId"
              placeholder="请选择物料组"
              clearable
              filterable
            >
              <el-option
                v-for="item in mdmmatgroup"
                :key="item.id"
                :label="item.materialGroupName"
                :value="item.id"
              />
            </el-select>

            <span class="word" v-else>{{ materialGroup }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="物料类型" prop="materialType">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.materialType"
              placeholder="请选择物料类型"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('MaterialType')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{
              useDictionary("MaterialType", formData.materialType)
            }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="物料状态" prop="materialState">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.materialState"
              placeholder="请选择物料状态"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('MaterialState')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{
              useDictionary("MaterialState", formData.materialState)
            }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- 第三行 -->
      <el-row>
        <el-col :span="6">
          <el-form-item label="计量单位" prop="unitCode">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.unitCode"
              placeholder="请选择计量单位"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList(
                  'MeasurementUnit'
                )"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
            <span v-else>{{
              useDictionary("MeasurementUnit", formData.unitCode)
            }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="包装物料类别" prop="packageType">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.packageType"
              placeholder="请选择包装物料类别"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('PackageType')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{
              useDictionary("PackageType", formData.packageType)
            }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="报废追踪" prop="isBatchManage">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.isBatchManage"
              placeholder="请选择是否需要报废追踪"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('YesNo')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{
              useDictionary("YesNo", formData.isBatchManage)
            }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="特殊维修" prop="ownAssets">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.ownAssets"
              placeholder="请选择特殊维修"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('YesNo')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{ useDictionary("YesNo", formData.ownAssets) }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- 第四行 -->
      <el-row>
        <el-col :span="6">
          <el-form-item label="采购类型" prop="purchaseType">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.purchaseType"
              placeholder="请选择采购类型"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('PurchaseType')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{
              useDictionary("PurchaseType", formData.purchaseType)
            }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="采购批量类型" prop="purchaseChkBatchType">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.purchaseChkBatchType"
              placeholder="请选择采购批量类型"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('LotType')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{
              useDictionary("LotType", formData.purchaseChkBatchType)
            }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="国产件标识" prop="lcCkd">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.lcCkd"
              placeholder="请选择是否是国产件标识"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList('YesNo')"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{ useDictionary("YesNo", formData.lcCkd) }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="图号" prop="figureNumber">
            <el-input
              v-if="!props.isReadonly"
              v-model="formData.figureNumber"
              placeholder="请输入图号"
              clearable
            />
            <span class="word" v-else>{{ formData.figureNumber }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="入库检查种类" prop="inbChkType">
            <el-select
              v-if="!props.isReadonly"
              v-model="formData.inbChkType"
              placeholder="请选择入库检查种类"
              clearable
            >
              <el-option
                v-for="item in dictionaryStore.filterDictList(
                  'InboundCheckType'
                )"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>

            <span v-else>{{
              useDictionary("InboundCheckType", formData.inbChkType)
            }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="启用状态" prop="enabled">
            <el-radio-group v-model="formData.enabled" v-if="!props.isReadonly">
              <el-radio :label="'1'">是</el-radio>
              <el-radio :label="'0'">否</el-radio>
            </el-radio-group>

            <span v-else>{{ formData.enabled == 1 ? "是" : "否" }}</span>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="质检比例" prop="testProp">
            <el-input-number
              v-if="!props.isReadonly"
              v-model="formData.testProp"
              placeholder="请输入质检比例"
              :min="0"
              :max="1"
            />

            <span v-else>{{ formData.testProp }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="是否绑定RFID" prop="isRfid">
            <el-radio-group v-model="formData.isRfid" v-if="!props.isReadonly">
              <el-radio :label="'1'">是</el-radio>
              <el-radio :label="'0'">否</el-radio>
            </el-radio-group>

            <span v-else>{{ formData.isRfid == 1 ? "是" : "否" }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="6">
          <el-form-item label="仓库" prop="warehouseId">
            <el-select
              v-model="formData.warehouseId"
              clearable
              :disabled="props.isReadonly ? true : false"
              placeholder="请选择仓库"
              @change="warehouseChange"
              @clear="warehouseClear"
            >
              <el-option
                v-for="item in warehouses"
                :key="item.id"
                :label="item.warehouseCode + '-' + item.warehouseName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :span="6">
          <el-form-item label="存储区" prop="storageSectionId">
            <el-select
              v-model="formData.storageSectionId"
              clearable
              :disabled="props.isReadonly ? true : false"
              placeholder="请选择存储区"
              @change="storageSectionChange"
              @clear="storageSectionClear"
            >
              <el-option
                v-for="item in storageSections"
                :key="item.id"
                :label="item.storageSectionName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="料架" prop="shelfId">
            <el-select
              v-model="formData.shelfId"
              clearable
              :disabled="props.isReadonly ? true : false"
              placeholder="请选择料架"
              @change="shelfChange"
              @clear="shelfClear"
            >
              <el-option
                v-for="item in shelfs"
                :key="item.id"
                :label="item.shelfName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="仓位" prop="binId">
            <el-select
              v-model="formData.binId"
              clearable
              :disabled="props.isReadonly ? true : false"
              placeholder="请选择仓位"
              @change="binChange"
              @clear="binClear"
            >
              <el-option
                v-for="item in bins"
                :key="item.id"
                :label="item.binName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <!-- <el-col :span="6">
          <el-form-item label="库龄设置" prop="stockageTaskId">
            <el-select
              v-model="formData.stockageTaskId"
              clearable
              :disabled="props.isReadonly ? true : false"
              placeholder="请选择库龄"
              @change="stockageTaskChange"
              @clear="stockageTaskClear"
            >
              <el-option
                v-for="item in stockageTasks"
                :key="item.id"
                :label="item.stockageTaskName"
                :value="item.id"
              />
            </el-select>
          </el-form-item>
        </el-col> -->
        <el-col :span="6">
          <el-form-item label="备注" prop="remarks">
            <el-input
              v-if="!props.isReadonly"
              v-model="formData.remarks"
              placeholder="请输入备注"
            />
            <span style="word-wrap: break-word; width: 900px" v-else>{{
              formData.remarks
            }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <el-tabs v-model="activeName" type="border-card">
        <el-tab-pane label="规格信息" name="first">
          <!-- 第六行 -->
          <el-row>
            <el-col :span="6">
              <el-form-item label="长度" prop="length">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.length"
                  placeholder="请输入长度"
                >
                  <template #append>m</template>
                </el-input>

                <span v-else>{{ formData.length }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="宽度" prop="width">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.width"
                  placeholder="请输入宽度"
                >
                  <template #append>m</template>
                </el-input>

                <span v-else>{{ formData.width }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="高度" prop="height">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.height"
                  placeholder="请输入高度"
                >
                  <template #append>m</template>
                </el-input>

                <span v-else>{{ formData.height }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="底面积" prop="basalArea">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.basalArea"
                  placeholder="请输入底面积"
                >
                  <template #append>m²</template>
                </el-input>

                <span v-else>{{ formData.basalArea }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <!-- 第七行 -->
          <el-row>
            <el-col :span="6">
              <el-form-item label="毛重" prop="roughWeight">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.roughWeight"
                  placeholder="请输入毛重"
                >
                  <template #append>kg</template>
                </el-input>

                <span v-else>{{ formData.roughWeight }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="净重" prop="netWeight">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.netWeight"
                  placeholder="请输入净重"
                >
                  <template #append>kg</template>
                </el-input>

                <span v-else>{{ formData.netWeight }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="容积" prop="cubage">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.cubage"
                  placeholder="请输入容积"
                >
                  <template #append>L</template>
                </el-input>

                <span v-else>{{ formData.cubage }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="体积" prop="volume">
                <el-input
                  v-if="!props.isReadonly"
                  v-model="formData.volume"
                  placeholder="请输入体积"
                >
                  <template #append>m³</template>
                </el-input>

                <span v-else>{{ formData.volume }}</span>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="物料规格" prop="materialSpecification">
            <el-input
              v-if="!props.isReadonly"
              v-model="formData.materialSpecification"
              placeholder="请输入物料规格"
              style="width: 100%"
            />

            <span v-else>{{ formData.materialSpecification }}</span>
          </el-form-item>
        </el-tab-pane>
      </el-tabs>

      <el-row style="margin-top: 10px">
        <el-col :span="6">
          <el-form-item
            label="创建时间"
            v-if="props.isReadonly"
            prop="createTime"
          >
            <span>{{ formData.createTime }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item v-if="props.isReadonly" label="创建人">
            <span>{{ formData.createdUserName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item
            label="修改时间"
            v-if="props.isReadonly"
            prop="lastUpdateTime"
          >
            <span>{{ formData.lastUpdateTime }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item
            label="修改人"
            v-if="props.isReadonly"
            prop="lastUpdatedUserName"
          >
            <span>{{ formData.lastUpdatedUserName }}</span>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>

    <template #footer>
      <div class="dialog-footer">
        <el-button
          v-if="!props.isReadonly"
          type="primary"
          :loading="loading"
          @click="handleSubmit"
          >确 定</el-button
        >
        <el-button @click="closeDialog">取 消</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import request from "@/utils/request";
import { useDictStoreHook } from "@/store/modules/dictionary"; // 引入
const dictionaryStore = useDictStoreHook();
import { useDictionary } from "@/utils/useTable";

defineOptions({
  name: "NPMMDMMATERIALADDORUPDATE",
  inheritAttrs: false,
});

const emit = defineEmits(["reset-table", "change-visible"]);

const props = defineProps({
  visible: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  title: {
    type: String,
    default: () => {
      return "";
    },
  },
  data: {
    type: Object,
    default: () => {
      return {};
    },
  },
  isReadonly: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
  rulesValue: {
    type: Boolean,
    default: () => {
      return false;
    },
  },
});

const visibleDialog = ref(false);
watch(
  () => props.visible,
  (newVal: boolean) => {
    visibleDialog.value = newVal;
  }
);
watch(
  () => props.rulesValue,
  (newVal: boolean) => {}
);
let formData: any = reactive({
  id: "",
  testProp: "",
  materialCode: "",
  materialName: "",
  materialGroupId: "",
  materialTypeId: "",
  materialType: "",
  shortCode: "",
  organizationId: "",
  organizationCode: "",
  plantId: "",
  plantCode: "",
  srcCode: "",
  lcCkd: "",
  materialState: "",
  packageType: "",
  handlingUnitType: "",
  ownAssets: "",
  materialSpecification: "",
  unitCode: "",
  length: "",
  width: "",
  height: "",
  cubage: "",
  basalArea: "",
  volume: "",
  roughWeight: "",
  netWeight: "",
  enabled: "",
  remarks: "",
  version: "",
  deleted: "",
  createTime: "",
  createdUserId: "",
  createdUserName: "",
  lastUpdatedTime: "",
  lastUpdatedUserId: "",
  lastUpdatedUserName: "",
  lastUpdateTime: "",
  figureNumber: "",
  inbChkType: "",
  purchaseChkBatchType: "",
  purchaseType: "",
  warehouseId: "",
  warehouseCode: "",
  warehouseName: "",
  storageSectionId: "",
  storageSectionCode: "",
  storageSectionName: "",
  shelfId: "",
  shelfCode: "",
  shelfName: "",
  binId: "",
  binCode: "",
  binName: "",
  isRfid: "",
  stockageTaskId: "",
  stockageTaskCode: "",
  stockageTaskName: "",
  isBatchManage: "",
});
const rules = reactive({
  materialCode: [
    {
      required: true,
      pattern: "[^ \x20]+",
      message: "请输入物料编号",
      trigger: "blur",
    },
    {
      required: true,
      message: "请输入物料名称",
      trigger: "blur",
    },
    // { min: 7, max: 7, message: "物料编号必须为7位", trigger: "blur" },
  ],

  materialName: [
    {
      required: true,
      pattern: "[^ \x20]+",
      message: "请输入物料名称",
      trigger: "blur",
    },
    {
      required: true,
      message: "请输入物料名称",
      trigger: "blur",
    },
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  figureNumber: [
    {
      pattern: "[^ \x20]+",
      message: "请输入图号",
      trigger: "blur",
    },
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  // materialGroupId: [
  //   { required: true, message: "请输入物料组", trigger: "change" },
  // ],
  materialType: [
    { required: true, message: "请输入物料类型", trigger: "change" },
  ],
  shortCode: [
    {
      pattern: "[^ \x20]+",
      message: "请输入短号",
      trigger: "blur",
    },
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  // plantCode: [{ required: true, message: "请输入工厂编号", trigger: "change" }],
  srcCode: [
    {
      pattern: "[^ \x20]+",
      message: "请输入外来编号",
      trigger: "blur",
    },
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  lcCkd: [{ message: "请输入国产件标识", trigger: "change" }],
  materialState: [
    { required: true, message: "请输入物料状态", trigger: "change" },
  ],
  // packageType: [
  //   { required: true, message: "请输入包装物料类别", trigger: "change" },
  // ],
  handlingUnitType: [{ message: "请输入包装单位类别", trigger: "change" }],
  ownAssets: [{ message: "请输入是否特殊维修", trigger: "change" }],
  materialSpecification: [
    {
      pattern: "[^ \x20]+",
      message: "请输入物料名称",
      trigger: "blur",
    },
    { min: 1, max: 50, message: "长度在 1 到 50 个字符", trigger: "blur" },
  ],
  unitCode: [{ required: true, message: "请输入计量单位", trigger: "change" }],
  inbChkType: [],
  length: [],
  width: [],
  height: [],
  cubage: [],
  basalArea: [],
  volume: [],
  roughWeight: [],
  netWeight: [],
  enabled: [],
  remarks: [
    { min: 1, max: 255, message: "长度在 1 到 255 个字符", trigger: "blur" },
  ],
});

function validateDegree(rule: any, value: any, callback: (a?: any) => {}) {
  if (isNaN(parseFloat(value)) && isFinite(value)) {
    callback(new Error("请输入数字"));
  } else if (!/^[+-]?\d+?(e[+-]?\d+)?$/.test(value)) {
    callback(new Error("请输入的数字"));
  } else if (Number(value) < 0) {
    callback(new Error("请输入大于0的数字"));
  } else {
    callback();
  }
}

const materialGroup = ref("");
const materialGroupChange = (id: any) => {
  for (let i = 0; i < mdmmatgroup.value.length; i++) {
    if (mdmmatgroup.value[i].id == id) {
      materialGroup.value = mdmmatgroup.value[i].materialGroupName;
    }
  }
};

const plantListLable = ref("");
const plant = (code: any) => {
  for (let i = 0; i < plantList.value.length; i++) {
    if (plantList.value[i].organizationCode == code) {
      plantListLable.value = plantList.value[i].organizationName;
    }
  }
};

const formRef = ref(ElForm);

watch(
  () => props.data,
  (newVal: any) => {
    formData.id = "";
    if (newVal?.id) {
      const {
        id,
        testProp,
        materialCode,
        materialName,
        materialGroupId,
        materialTypeId,
        materialType,
        shortCode,
        organizationId,
        organizationCode,
        plantId,
        plantCode,
        srcCode,
        lcCkd,
        materialState,
        packageType,
        handlingUnitType,
        ownAssets,
        materialSpecification,
        unitCode,
        length,
        width,
        height,
        cubage,
        basalArea,
        volume,
        roughWeight,
        netWeight,
        enabled,
        remarks,
        version,
        deleted,
        createTime,
        createdUserId,
        createdUserName,
        lastUpdatedTime,
        lastUpdatedUserId,
        lastUpdatedUserName,
        lastUpdateTime,
        figureNumber,
        inbChkType,
        purchaseChkBatchType,
        purchaseType,
        warehouseId,
        warehouseCode,
        warehouseName,
        storageSectionId,
        storageSectionCode,
        storageSectionName,
        shelfId,
        shelfCode,
        shelfName,
        binId,
        binCode,
        binName,
        isRfid,
        isBatchManage,
        stockageTaskId,
        stockageTaskCode,
        stockageTaskName,
      } = newVal;
      Object.assign(formData, {
        id,
        testProp,
        materialCode,
        materialName,
        materialGroupId,
        materialTypeId,
        materialType,
        shortCode,
        organizationId,
        organizationCode,
        plantId,
        plantCode,
        srcCode,
        lcCkd,
        materialState,
        packageType,
        handlingUnitType,
        ownAssets,
        materialSpecification,
        unitCode,
        length,
        width,
        height,
        cubage,
        basalArea,
        volume,
        roughWeight,
        netWeight,
        enabled,
        remarks,
        version,
        deleted,
        createTime,
        createdUserId,
        createdUserName,
        lastUpdatedTime,
        lastUpdatedUserId,
        lastUpdatedUserName,
        lastUpdateTime,
        figureNumber,
        inbChkType,
        purchaseChkBatchType,
        purchaseType,
        warehouseId,
        warehouseCode,
        warehouseName,
        storageSectionId,
        storageSectionCode,
        storageSectionName,
        shelfId,
        shelfCode,
        shelfName,
        binId,
        binCode,
        binName,
        isRfid,
        isBatchManage,
        stockageTaskId,
        stockageTaskCode,
        stockageTaskName,
      });
      formData.packageType = formData.packageType
        ? String(formData.packageType)
        : "";
      formData.lcCkd = formData.lcCkd ? String(formData.lcCkd) : "";
      formData.materialType = formData.materialType
        ? String(formData.materialType)
        : "";
      formData.unitCodeunitCode = formData.unitCode
        ? String(formData.unitCode)
        : "";
      formData.materialState = formData.materialState
        ? String(formData.materialState)
        : "";
      formData.handlingUnitType = formData.handlingUnitType
        ? String(formData.handlingUnitType)
        : "";
      formData.ownAssets = formData.ownAssets ? String(formData.ownAssets) : "";
      formData.enabled = formData.enabled + "";
      //formData.enabled = formData.enabled ? Number(formData.enabled) : "";
      formData.purchaseType = formData.purchaseType
        ? String(formData.purchaseType)
        : "";
      formData.inbChkType = formData.inbChkType
        ? String(formData.inbChkType)
        : "";
      formData.purchaseChkBatchType = formData.purchaseChkBatchType
        ? String(formData.purchaseChkBatchType)
        : "";
      formData.isBatchManage = String(formData.isBatchManage);
      materialGroupChange(formData.materialGroupId);
      plant(formData.plantCode);
      getMdmmatgroup();
    }
  }
);

/** 关闭表单弹窗 */
function closeDialog() {
  visibleDialog.value = false;
  emit("change-visible", false);
  resetForm();
}

/** 重置表单 */
function resetForm() {
  formRef.value.resetFields();
  // formRef.value.clearValidate();
  formData.testProp = "";
  formData.id = "";
  formData.materialCode = "";
  formData.materialName = "";
  formData.materialGroupId = "";
  formData.materialTypeId = "";
  formData.materialType = "";
  formData.shortCode = "";
  formData.organizationId = "";
  formData.organizationCode = "";
  formData.plantId = "";
  formData.plantCode = "";
  formData.srcCode = "";
  formData.lcCkd = "";
  formData.materialState = "";
  formData.packageType = "";
  formData.isBatchManage = "";
  formData.handlingUnitType = "";
  formData.ownAssets = "";
  formData.materialSpecification = "";
  formData.unitCode = "";
  formData.length = "";
  formData.width = "";
  formData.height = "";
  formData.cubage = "";
  formData.basalArea = "";
  formData.volume = "";
  formData.roughWeight = "";
  formData.netWeight = "";
  formData.enabled = "";
  formData.remarks = "";
  formData.version = "";
  formData.deleted = "";
  formData.createTime = "";
  formData.createdUserId = "";
  formData.createdUserName = "";
  formData.lastUpdatedTime = "";
  formData.lastUpdatedUserId = "";
  formData.lastUpdatedUserName = "";
  formData.figureNumber = "";
  formData.inbChkType = "";
  formData.purchaseChkBatchType = "";
  formData.purchaseType = "";
  formData.warehouseId = "";
  formData.warehouseCode = "";
  formData.warehouseName = "";
  formData.storageSectionId = "";
  formData.storageSectionCode = "";
  formData.storageSectionName = "";
  formData.shelfId = "";
  formData.shelfCode = "";
  formData.shelfName = "";
  formData.binId = "";
  formData.binCode = "";
  formData.binName = "";
  formData.isRfid = "";
  formData.stockageTaskId = "";
  formData.stockageTaskCode = "";
  formData.stockageTaskName = "";
}
// 一开始展示基本数据
const activeName = ref("first");

const loading = ref(false);

/** 物料主数据保存提交 */
function handleSubmit() {
  if (formData.testProp > 0 && formData.testProp < 1) {
    ElMessage.error(`比例只能为0或1`);
    return;
  }
  formRef.value.validate(async (valid: any) => {
    if (valid) {
      for (let i = 0; i < plantList.value.length; i++) {
        if (plantList.value[i].organizationCode == formData.plantCode) {
          formData.plantId = plantList.value[i].id;
        }
      }
      loading.value = true;
      const text = formData.id ? "编辑" : "新增";
      await request({
        url: "/wms/mdmmaterial/save",
        method: "post",
        data: formData,
      }).finally(() => {
        loading.value = false;
      });
      ElMessage.success(text + `成功`);
      closeDialog();
      emit("reset-table", formData.id);
    }
  });
}
const plantList: any = ref([]);
const mdmmatgroup: any = ref([]);
const getPlantList = async () => {
  const res1 = await request({
    url: "system/sysOrganization/getList",
    method: "post",
    data: { organizationType: 4 },
  });
  plantList.value = res1.data;
};

const getMdmmatgroup = async () => {
  if (formData.plantCode != "") {
    for (let i = 0; i < plantList.value.length; i++) {
      if (plantList.value[i].organizationCode == formData.plantCode) {
        formData.plantId = plantList.value[i].id;
      }
    }

    const res2 = await request({
      url: `/wms/mdmmatgroup/getList`,
      method: "post",
      data: { plantId: formData.plantId },
    });

    mdmmatgroup.value = res2.data;
  } else {
    formData.materialGroupId = "";
    mdmmatgroup.value = [];
  }
};

// 输入框出发时
const changePlant = () => {
  getMdmmatgroup();
};
onMounted(() => {
  getPlantList();
  getWarehouses();
  //getStockageTask();
});

// 组件销毁时调用
onBeforeUnmount(() => {
  visibleDialog.value = false;
  emit("change-visible", false);
});
let warehouses = ref([]);
let shelfs = ref([]);
let bins = ref([]);
let storageSections = ref([]);
let stockageTasks = ref([]);

async function getWarehouses() {
  const data = await request({
    url: "/wms/wmswarehouse/getList",
    method: "get",
    params: { organizationId: formData.organizationId },
  });
  warehouses.value = data.data;
}

function warehouseChange(id: string) {
  if (id) {
    var warehouse = warehouses.value.find((item) => {
      return item.id === formData.warehouseId;
    });
    formData.warehouseCode = warehouse.warehouseCode;
    formData.warehouseName = warehouse.warehouseName;
    getStorageSections();
    getShelf();
    getbin();
  }
}

function storageSectionChange(id: string) {
  if (id) {
    var storageSection = storageSections.value.find((item) => {
      return item.id === formData.storageSectionId;
    });
    formData.storageSectionCode = storageSection.storageSectionCode;
    formData.storageSectionName = storageSection.storageSectionName;
    getShelf();
    getbin();
  }
}
async function getbin() {
  formData.binId = "";
  formData.binCode = "";
  formData.binName = "";
  const data = await request({
    url: "/wms/wmsbin/getOptionList",
    method: "post",
    data: {
      shelfId: formData.shelfId,
      storageSectionId: formData.storageSectionId,
      warehouseId: formData.warehouseId,
      deleted: 0,
    },
  });
  bins.value = data.data;
}
function shelfChange(id: string) {
  if (id) {
    var shelf = shelfs.value.find((item) => {
      return item.id === formData.shelfId;
    });
    formData.shelfCode = shelf.shelfCode;
    formData.shelfName = shelf.shelfName;
    getbin();
  }
}

function binChange(id: string) {
  if (id) {
    var bin = bins.value.find((item) => {
      return item.id === formData.binId;
    });
    formData.binCode = bin.binCode;
    formData.binName = bin.binName;
  }
}
async function getStorageSections() {
  formData.storageSectionId = "";
  formData.storageSectionCode = "";
  formData.storageSectionName = "";
  const data = await request({
    url: "/wms/wmsstoragesection/getOptionList",
    method: "post",
    data: {
      warehouseId: formData.warehouseId,
    },
  });
  storageSections.value = data.data;
}

function warehouseClear() {
  getWarehouses();
  getStorageSections();
  getShelf();
  getbin();
}

function storageSectionClear() {
  getStorageSections();
  getShelf();
  getbin();
}

function shelfClear() {
  getShelf();
  getbin();
}
function binClear() {
  formData.binId = "";
  formData.binCode = "";
  formData.binName = "";
}
async function getShelf() {
  formData.shelfId = "";
  formData.shelfCode = "";
  formData.shelfName = "";
  const data = await request({
    url: "/wms/wmsshelf/getOptionList",
    method: "post",
    data: {
      storageSectionId: formData.storageSectionId,
      warehouseId: formData.warehouseId,
    },
  });
  shelfs.value = data.data;
}

async function getStockageTask() {
  formData.stockageTaskId = "";
  formData.stockageTaskCode = "";
  formData.stockageTaskName = "";
  const data = await request({
    url: "/wms/wmsstockagetask/getOptionList",
    method: "post",
    data: {
      enabled: 1,
      deleted: 0,
    },
  });
  stockageTasks.value = data.data;
}

async function stockageTaskChange(id: string) {
  if (id) {
    var stockageTask = stockageTasks.value.find((item) => {
      return item.id === formData.stockageTaskId;
    });
    formData.stockageTaskCode = stockageTask.stockageTaskCode;
    formData.stockageTaskName = stockageTask.stockageTaskName;
  }
}

async function stockageTaskClear() {
  formData.stockageTaskId = "";
  formData.stockageTaskCode = "";
  formData.stockageTaskName = "";
}
</script>
<style scoped lang="scss">
.right-input {
  :deep(.el-input__inner) {
    text-align: right;
    padding-right: 20px;
  }

  :deep(.el-input__inner::placeholder) {
    text-align: right;
  }

  :deep(.el-form-item__error) {
    right: 0px !important;
  }
}
.word {
  word-wrap: break-word;
  width: 200px; /* 设置容器宽度 */
}
</style>
